import React from 'react';
// import classnames from 'classnames';
import { CloseOutline, CheckOutline } from 'antd-mobile-icons';
import './index.module.scss';
interface orderStatusProps {
  orderStatus: number;
  orderCreatTime: string;
}
export default function OrderStatus(props: orderStatusProps) {
  const { orderStatus } = props;
  return (
    <>
      {orderStatus == 1 || orderStatus == 3 ? (
        <div styleName="order-status-info flex">
          <div styleName="left-info">
            <div styleName="close-icon">
              {orderStatus == 3 ? (
                <CloseOutline styleName="icon" />
              ) : (
                <CheckOutline styleName="icon" />
              )}
            </div>
          </div>
          <div styleName="right-info">
            <div className="fn24" styleName="title">
              {orderStatus == 3 ? '已取消' : '出票成功'}
            </div>
            <div className="fn13" styleName="info">
              {orderStatus == 3
                ? '您的订单因支付超时取消，可重新订购'
                : '请您持购票证件在车站或代售点取票后按时乘车'}
            </div>
          </div>
        </div>
      ) : orderStatus == 2 ? (
        <div styleName="no-pay-status">
          <div styleName="left-status">待支付</div>
          <div styleName="right-time">
            <span>支付剩余</span>
            <span>58:09分</span>
          </div>
        </div>
      ) : (
        ''
      )}
    </>
  );
}
